<template>
  <div class="vip">
    <Card :bordered="false">
      <p slot="title">vip购买</p>
      <Row>
        <Col>
          <div style="width: 650px;height:651px;float: right;">
            <p style="font-size: 36px"> vip购买</p>

            <Row style="margin-left: 23%;margin-top: 20px;margin-bottom: 20px;font-size: 24px" >
              <Col span="9"><Icon type="ios-analytics-outline" />尊贵身份</Col>
              <Col span="9"><Icon type="md-checkmark" />折扣优惠</Col>
            </Row>
            <Row style="margin-left: 23%;margin-bottom: 40px;font-size: 24px">
              <Col span="9"><Icon type="ios-cloud-download-outline" />下单加速</Col>
              <Col span="9"><Icon type="ios-call" />专属客服</Col>
            </Row>
            <Button @click="addVipTime">购买</Button>
          </div>
           <img src="../assets/vip.jpeg"/>
        </Col>
      </Row>
    </Card>
  </div>
</template>

<script>
  import axios from "axios";

  export default {
    name: "vip",
    data(){
      return{
        userF:{
          vipTimeString:'',
          id:''
        }
      }
    },
    methods:{
      addVipTime(){
        this.userF.id = this.$getCookie("userId")
          this.userF.vipTimeString = this.$getCookie("vipTime")
        if (this.userF.vipTimeString && new Date(this.userF.vipTimeString)>=new Date()){
          this.userF.vipTimeString = new Date(new Date(this.userF.vipTimeString).setMonth(new Date(this.userF.vipTimeString ).getMonth()+1));
        }else{
          this.userF.vipTimeString = new Date(new Date().setMonth(new Date().getMonth()+1));
        }
        axios.get("http://localhost:8888/changePwd",{params:this.userF}).then(res =>{
          if (res){
            this.$Message.success("vip购买成功")
            this.$setCookie("vipTime",this.userF.vipTimeString)
          }else{
            this.$Message.error("vip购买失败")
          }
        })
      }
    }
  }
</script>

<style scoped>
  .vip{
    background: #eee;
  }
</style>
